<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8"/>
    <link rel="stylesheet" href="../../lib/layui/css/layui.css">
    <link rel="stylesheet" href="../../css/oksub.css">
    <title>办结列表页</title>
</head>
<style>
    .list-con {
        padding: 0 10px 15px 10px;
        margin-bottom: 20px;
    }

    .list-con .layui-table td,
    .layui-table-view,
    .layui-table[lay-skin=line],
    .layui-table[lay-skin=row] {
        border: none;
    }

    .list-con .layui-table tbody {
        color: #777777;
    }

    .list-con .layui-table tbody tr:hover,
    .layui-table[lay-even] tr:nth-child(even) {
        background-color: rgb(255, 255, 255);
        color: #000000;
    }

    .layui-table tr {
        border-bottom: 1px #e2e2e2 solid;
    }

    .list-margin {
        margin-left: -30px;
    }
</style>

<body>
<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>已办结警情</legend>
    <div style="z-index: 9999; position: fixed ! important; right:50px; top: 15px;">
        <div id="selectForm" style="float: right; margin-right:50px;" lay-event="search" class="layui-btn layui-btn-normal layui-btn-radius">
            <i class="layui-icon layui-icon-search"></i>
        </div>
        <div id="backAll" style="float: right; margin-right:10px;"
             class="layui-btn layui-btn-normal layui-btn-radius" lay-event="backAll">
            刷新
        </div>
    </div>
</fieldset>

<!--数据表格-->
<div class="list-con">
    <table class="layui-hide" id="tableId" lay-filter="tableId"></table>
</div>
</body>
<script src="../../lib/layui/layui.js"></script>
<script src="../../js/jquery.min.js"></script>
<script src="../../js/application.js"></script>
<script src="../../js/model.js"></script>
<script>
    layui.use(["table", 'laydate', "okLayer"], function () {
        let $ = layui.jquery;
        let table = layui.table;
        var form = layui.form, laydate = layui.laydate;
        let okLayer = layui.okLayer;

        //搜索
        $("#selectForm").on('click', selectForm)
        function selectForm() {
            okLayer.open("查询条件", "selectForm.html", "35%", "60%", function (layero) {
                let iframeWin = window[layero.find("iframe")[0]["name"]];
            }, function () {
                //根据子页面传过来的查询参数进行查询
                var caseId = window.document.caseId;
                var procLevel = window.document.procLevel;
                var caseDescription = window.document.caseDescription;
                var startTime = window.document.startTime;
                var endTime = window.document.endTime;
                var newStartDate = startTime.replace(/-/g, "/");//时间格式转换
                var newEndDate = endTime.replace(/-/g, "/");
                //将子页面搜索框置空
                window.document.caseId="";
                window.document.procLevel="";
                window.document.caseDescription="";
                window.document.startTime="";
                window.document.endTime="";
                var isChange=window.document.isChange;
                window.document.isChange=0
                if(isChange!=1){
                    return
                }
                articleTable.reload({
                    where: {
                        'selectConditionJson': JSON.stringify(new SelectCaseStausCondition(caseId, procLevel, caseDescription, newStartDate, newEndDate, "", 5))
                    },
                    page: {
                        curr: 1
                    }
                })
            })
        }

        //刷新
        $("#backAll").on('click', backAll)
        function backAll() {
            articleTable.reload({
                where: {
                    'selectConditionJson': JSON.stringify(new SelectCaseStausCondition("", "", "", "", "", "", 5))
                },
                page: {
                    curr: 1
                }
            })
        }

        //办结列表获取数据并绑定
        let articleTable = table.render({
            elem: "#tableId",
            url: mainUri + "/VCaseProcInfoByPolice/getPoliceTracking",
            toolbar:true,
            where: {
                'selectConditionJson': JSON.stringify(new SelectCaseStausCondition("", "", "", "", "", "", 5))
            },
            cols: [[
                {field: "processId", title: "分派编号", hide: true},
                {field: "caseId", title: "警情编号", width: 250 /*hide:true*/},
                {field: "caseDescription", title: "警情描述"},
                {
                    field: "alarmType", title: "报警类型", width: 300, templet: function (d) {
                        return d.alarmCategory + "-" + d.alarmType + "-" + d.alarmSystem + "-"+ d.alarmSubclass
                    }
                },
                {
                    field: "procLevel", title: "督办级别", width: 150, templet: function (d) {
                        if (d.procLevel == "一级") {
                            return "<div style='color:#d92d29;font-weight: bold;font-size:15px'>" + d.procLevel + "</div>"
                        } else if (d.procLevel == "二级") {
                            return "<div style='color:#f09614;font-weight: bold;font-size:15px'>" + d.procLevel + "</div>"
                        } else if (d.procLevel == "三级") {
                            return "<div style='color:#fae600;font-weight: bold;font-size:15px'>" + d.procLevel + "</div>"
                        } else{
                            return "<div style='color:#478f43;font-weight: bold;font-size:15px'>" + d.procLevel + "</div>"
                        }
                    }
                },
                {field: "incidentSite", title: "事发地区"},
                {
                    field: "fullName", title: "办结人", templet: function (d) {
                        return d.fullName + "(" + d.departmentName + ")"
                    }
                },
                {field: "proceDate", title: "办结时间", width: 250}
            ]],
            page: {
                layout: ['prev', 'page', 'next', 'skip', 'count'],
                groups: 3,
                limit: 15,
                theme: '#1E9FFF',
            }
        });

        //监听行单击事件（双击事件为：rowDouble）
        table.on('row(tableId)', function (obj) {
            var data = obj.data;
            let uri = "end.html?processId=" + data.processId + "&caseId=" + data.caseId + "&fullName=" + data.fullName + "&departmentName=" + data.departmentName;
            show(uri);
            //标注选中样式
            obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
        });
        //跳转详细页设置
        function show(uri) {
            window.open(uri, 'newwindow', 'width=' + (window.screen.availWidth - 10) + ',height=' + (window.screen.availHeight - 30) + ', top=0, left=0, toolbar=no, menubar=no, scrollbars=yes, resizable=yes,location=no, status=no')
        }
    })

</script>
</html>